<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>交易记录 - 财产中心 - 用户中心</title>
  {include file="public/css"}
</head>
<body>

<!-- 头部开始 -->
{include file="public/header"}
<!-- 头部结束 -->

<div class="layui-main fly-marginTop fly-user-main ">

<div class="user-left-menu" style=""> 

<!-- 用户中心导航菜单 -->
{include file="public/left_menu"}
</div>
        <div class="fly-panel fly-panel-user user-right-content" pad20>

        <div class="layui-tab layui-tab-brief" lay-filter="user">
            <ul class="layui-tab-title" id="LAY_mine">
               <li data-type="mine-jie" lay-id="index" class="layui-this">交易记录</li>
          
     
            </ul>
            <div class="layui-tab-content" style="padding: 20px 0;">
            <!-- 筛选 -->
            <form class="layui-form" action="">
               <div class="layui-form-item">
                   <label class="layui-form-label" style="width:60px;">编号</label>
                  <div class="layui-input-inline" style="width:250px;">
                    <input type="text" name="id" placeholder="请输入编号" autocomplete="off" class="layui-input">
                  </div>
                 <label class="layui-form-label" style="width:60px;">交易状态</label>
                <div class="layui-input-inline" style="width:100px;">
                  <select name="status" >
                    <option value="">交易状态</option>
                    <option value="0">收入</option>
                    <option value="1">支出</option>

                  </select>
               </div>
<!--    <label class="layui-form-label">成交时间</label>
                            <div class="layui-input-inline" style="width:100px;">
                              <input type="text" name="start" id="start"   lay-verify="" placeholder="请选择开始范围" autocomplete="off" class="layui-input">
                            </div>
  <label class="layui-form-label">-</label>
                            <div class="layui-input-inline" style="width:100px;">
                              <input type="text" name="end"  id="end"  lay-verify="" placeholder="请选择结束范围" autocomplete="off" class="layui-input">
                            </div>       -->     
                    <div class="layui-input-inline" style="width:100px;">
                      <button class="layui-btn layui-btn-normal" lay-submit lay-filter="form">搜 索</button>
                
                    </div>
              </div>
              </form>
           </div>

                <!-- 表格内容 -->
                 <div class="layui-row">            
                   <table id="table"></table>
                </div>          
       

           </div>
           </div>
        </div>
        </div>
    
</div>
{include file="public/js"}
<!-- 会员底部文件 -->
{include file="public/footer"}



<script>

layui.use(['form','table','laypage','laydate'], function(){
  var form = layui.form;
  var laypage = layui.laypage; 
  var laydate = layui.laydate;
  var table = layui.table;

 ajax_table();
  //监听提交
  form.on('submit(form)', function(data){
     var where = data.field;
     ajax_table(where);
    return false;
  });

// 时间设置 
 laydate.render({
    elem: '#start' //指定元素
    ,theme: '#1290f5'
      ,lang:'cn'
  });
laydate.render({
    elem: '#end' //指定元素
    ,theme: '#1290f5'
      ,lang:'cn'
  });

//获得数据表格函数
function ajax_table(where=""){
     table.render({
      elem: '#table'
      ,limit:10
      // ,width:910
      // ,height:515
      ,where:where
      ,url: '{:url("finance/record")}' //数据接口
      ,page: {layout:['prev', 'page', 'next']} //开启分页
      ,loading:false
      ,skin: 'nob' //行边框风格
      ,size: 'lg' //小尺寸的表格
         ,text: {
      none: "没有更多数据" //默认：无数据。注：该属性为 layui 2.2.5 开始新增
      }
    ,size: 'lg' //小尺寸的表格
      ,cols: [[ //表头
      {field: 'id', title: "编号", width:80,sort: true}
      ,{field: 'payin', title: "收入", width:150,templet: '#payinTpl'}
      ,{field: 'payout', title: "支出", width:150}
      ,{field: 'create_time', title: "操作时间"} 
      ,{field: 'remark', title: "备注"}       
      ]]
    });
}

});
</script>
<script type="text/html" id="payinTpl">
   <span class="orange">{{d.payin}}</span>
</script>
<script type="text/html" id="statusTpl">
  {{#  if(d.status == 0){ }}
    待审核
  {{#  } else if(d.status == 1){ }}
    已审核
  {{#  } else if(d.status == 2){ }}
  交易中
  {{#  } else if(d.status == 3){ }}
  交易完成
  {{#  } }}
</script>
</body>
</html>